<%--
  Created by IntelliJ IDEA.
  User: q7792
  Date: 2018/12/9
  Time: 15:19
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ include file="/resources/layout/head.jsp" %>

<%@ include file="/resources/layout/admin/headBar.jsp" %>

<%@ include file="/resources/layout/admin/leftBar.jsp" %>
<div class="content">
<div class="card">
    <div class="card-header">
        <h4 class="page-title">用户管理</h4>
        <ul class="breadcrumb" style="font-size: 16px">
            <li><a href="./index">主页</a></li>
            <li class="active">用户列表</li>
        </ul>
    </div>
    <div class="card-body">
        <div class="btn-toolbar list-toolbar">
            <button class="btn btn-primary btn-sm"><i class="fa fa-plus"></i> 新用户</button>
        </div>
        <table class="table table-bordered">
            <thead>
            <tr>
                <th style="width:10%">#</th>
                <th style="width:20%">姓名</th>
                <th style="width:20%">用户名</th>
                <th style="width:20%">密码</th>
                <th style="width:10%">状态</th>
                <th style="width:20%">操作</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${list}" var="user" varStatus="num">
                <tr>
                    <td>${num.index}</td>
                    <td>${user.name}</td>
                    <td>${user.login_name}</td>
                    <td>${user.login_pwd}</td>
                    <td>${user.status}</td>
                    <td>
                        <button class="btn btn-default edit" value="${user.id }" data-toggle='modal'
                                data-target='#showModal'>
                            <i class="fa fa-pencil"></i>修改
                        </button>&nbsp;
                        <a href="#deleteModal" role="button" data-toggle="modal" class="btn btn-default">
                            <i class="fa fa-trash-o"></i>删除</a>
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
        <ul class="pager">
            <li class="previous disabled"><a href="#">共${page.pages}页</a></li>
            <li><a href="./data?page=${page.firstPage}">&laquo;首页</a></li>
            <li><a href="./data?page=${page.prePage}">前一页</a></li>
            <li><a href="./data?page=${page.nextPage}">后一页</a></li>
            <li><a href="./data?page=${page.lastPage}">尾页&raquo;</a></li>
        </ul>
        <div class="modal small fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        <h3 id="myModalLabel">删除提示</h3>
                    </div>
                    <div class="modal-body">
                        <p class="error-text"><i class="fa fa-warning modal-icon"></i>确定删除吗?<br>数据将无法被还原.</p>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">取消</button>
                        <button class="btn btn-danger" data-dismiss="modal">删除</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<%@ include file="/resources/layout/myModal.jsp" %>

<script src="<%=request.getContextPath()%>/resources/lib/bootstrap/js/bootstrap.js"></script>
<script src="<%=request.getContextPath()%>/resources/lib/bootstrap/js/toastr.min.js"></script>
<script type="text/javascript">
    toastr.options.positionClass = 'toast-center-center';
    $().ready(function () {
        //消息提示
        var msg = "${msg}";
        if (msg != null && msg != "") {
            toastr.success(msg);
        }
        //修改
        $(".edit").bind("click", function () {
            var id = $(this).val();
            $("#myModalLabel").text("修改");
            $('#myModal').modal({
                remote: "./edit?id=" + id,
            });
        });

        //清除数据
        $("#myModal").on("hidden.bs.modal", function () {
            $(this).removeData("bs.modal");
        });
    });
</script>
</body>
</html>
